import React, { type SVGProps } from "react";

export const LandingTableIcon = (props: SVGProps<SVGSVGElement>) => (
  <svg
    width={24}
    height={18}
    viewBox="0 0 24 18"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    {...props}
  >
    <path
      d="M3 0a3 3 0 0 0-3 3v1.5A1.5 1.5 0 0 0 1.5 6h6A1.5 1.5 0 0 0 9 4.5v-3A1.5 1.5 0 0 0 7.5 0H3Z"
      fill="url(#a)"
    />
    <path
      d="M1.5 9A1.5 1.5 0 0 0 0 10.5V15a3 3 0 0 0 3 3h4.5A1.5 1.5 0 0 0 9 16.5v-6A1.5 1.5 0 0 0 7.5 9h-6Z"
      fill="url(#b)"
    />
    <path
      d="M12 1.5A1.5 1.5 0 0 1 13.5 0H21a3 3 0 0 1 3 3v1.5A1.5 1.5 0 0 1 22.5 6h-9A1.5 1.5 0 0 1 12 4.5v-3Z"
      fill="url(#c)"
    />
    <path
      d="M13.5 9a1.5 1.5 0 0 0-1.5 1.5v6a1.5 1.5 0 0 0 1.5 1.5H21a3 3 0 0 0 3-3v-4.5A1.5 1.5 0 0 0 22.5 9h-9Z"
      fill="url(#d)"
    />
    <defs>
      <linearGradient
        id="a"
        x1={12}
        y1={0}
        x2={12}
        y2={18}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#3FDCF7" />
        <stop offset={1} stopColor="#3FDCF7" stopOpacity={0.4} />
      </linearGradient>
      <linearGradient
        id="b"
        x1={12}
        y1={0}
        x2={12}
        y2={18}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#3FDCF7" />
        <stop offset={1} stopColor="#3FDCF7" stopOpacity={0.4} />
      </linearGradient>
      <linearGradient
        id="c"
        x1={12}
        y1={0}
        x2={12}
        y2={18}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#3FDCF7" />
        <stop offset={1} stopColor="#3FDCF7" stopOpacity={0.4} />
      </linearGradient>
      <linearGradient
        id="d"
        x1={12}
        y1={0}
        x2={12}
        y2={18}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#3FDCF7" />
        <stop offset={1} stopColor="#3FDCF7" stopOpacity={0.4} />
      </linearGradient>
    </defs>
  </svg>
);
